
/*
 * @Author: WLang
 * @LastEditors: WLang
 * @Description: 
 * @Date: 2023-06-29 13:50:50
 * @LastEditTime: 2023-07-19 20:03:48
 * @FilePath: \myblog\src\router\index.js
 */
//pc端
import NProgress from 'nprogress'
import Vue from 'vue'
import VueRouter from 'vue-router'
import store from '../store'
//pc端
// import HomeView from '../views/HomeView.vue'
// import ArticleListView from '../views/ArticleList.vue'
// import ColumnView from '../views/ColumnView.vue'
// import ArticleView from '../views/ArticleView.vue'
// import EditorView from '../views/EditorView.vue'
// import UserInfo from '../views/UserInfo.vue'
// import SocketView from '../views/SocketView.vue'
//移动端
import MobileHome from '../mviews/MobileHome.vue'
import MobileArticle from '../mviews/MobileArticle.vue'
import ArticleDetail from '../mviews/ArticleDetail.vue'
import MobileColumn from '../mviews/ColumnView.vue'
import UserView from '../mviews/UserView.vue'
//动态懒加载路由
const ColumnView = () => import(/*webpackChunkName:"cloumn"*/'../views/ColumnView.vue')
const HomeView = () => import(/*webpackChunkName:"home"*/'../views/HomeView.vue')
const ArticleListView = () => import(/*webpackChunkName:"home"*/'../views/ArticleList.vue')
const EditorView = () => import(/*webpackChunkName:"editor"*/'../views/EditorView.vue')
const UserInfo = () => import(/*webpackChunkName:"user"*/'../views/UserInfo.vue')
const SocketView = () => import(/*webpackChunkName:"socket"*/'../views/SocketView.vue')
const ArticleView =() => import(/*webpackChunkName:"article"*/'../views/ArticleView.vue')

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'home',
    redirect: '/index',
    component: HomeView,
    children: [
      {
        path: '/column',
        name: 'column',
        meta: {
          requiresAuth: true
        },
        component: ColumnView
      },
      {
        path: '/index',
        name: 'index',
        component: ArticleListView
      },
      {
        path: '/article/:id',
        name: 'article',
        component: ArticleView
      },
      {
        path: '/editor',
        name: 'editor',
        component: EditorView,
        props: (route)=> ({
          columnId: route.query.columnId
        })
      },
      {
        path: '/user',
        name: 'user',
        component: UserInfo
      },
      {
        path: '/socket',
        name: 'socket',
        component: SocketView
      }
    ]
  },
  {
    path: '/m',
    name: 'mHome',
    redirect: '/m/articles',
    component: MobileHome,
    children: [
      {
        path: 'articles',
        name: 'mArticleList',
        component: MobileArticle,
        meta: {
          title: '文章',
          batType: 'SearchBar',
          tabType: 'TabBar'
        }
      },
      {
        path: 'article/:id',
        name: 'mArticle',
        component: ArticleDetail,
        meta: {
          title: '文章',
          batType: 'NavBar',
          tabType: 'CommentBar'
        }
      },
      {
        path: 'user',
        name: 'mUser',
        meta: {
          title: '用户',
          batType: 'NavBar',
          tabType: 'TabBar'
        },
        component: UserView,
        props: (route) => ({
          state: route.query.state
        })
      },
      {
        path: 'column',
        name: 'mColumn',
        component: MobileColumn,
        meta: {
          title: '分类',
          batType: 'NavBar',
          tabType: 'TabBar'
        }
      }
    ]
  }
]


const router = new VueRouter({
  routes
})

router.beforeEach((to, from, next) =>{
  let useAuth = to.meta.requiresAuth
  if (useAuth)
  {
    if (!store.state.token)
    {
      Vue.prototype.$notify({
        title: '警告',
        message: '请先登录',
        type: 'warning'
      });
      NProgress.done()
      next('/index')
    }
  }
  next()
})

router.afterEach(()=> {
  NProgress.done()
})

export default router
